import 'aoda.css'
import { getDeviceSize } from '@ecs/index'
import loader from './loader'
import Director from './director'
import store from './base/store'

const { width, height } = getDeviceSize()
const canvas = document.createElement('canvas')
canvas.width = width
canvas.height = height
canvas.innerText = '您的浏览器不支持canvas！'
canvas.style.cursor = 'pointer'
document.querySelector('#app').appendChild(canvas)
const ctx = canvas.getContext('2d')

/**
 * 程序类
 * @description 初始化canvas、绑定事件
 */
class Main {
  /** 导演类 */
  private director: Director = null

  constructor() {
    loader.onLoaded(map => {
      store.canvas = canvas
      store.ctx = ctx
      store.map = map
      this.director = Director.getInstance()
      this.director.onClickStart()
      this.bindEvent()
    })
  }

  /**
   * 绑定事件
   * @returns 无
   */
  private bindEvent(): void {
    const onClickCanvas = (e: TouchEvent | MouseEvent) => {
      e.preventDefault()
      this.director.isGameOver === true
        ? this.director.onClickStart() // 游戏结束
        : this.director.onClickBird() // 游戏进行
    }
    store.canvas.addEventListener('touchstart', onClickCanvas)
    store.canvas.addEventListener('click', onClickCanvas)
  }
}

new Main()
